<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head lang="en">
    <meta charset="UTF-8"/>
    <title></title>
    <link th:href="@{~/static/css/common.css}" rel="stylesheet" />
</head>
<body>
	<div th:include="/common/head"></div>
	
	<section id="main">
		<input type="hidden" th:value="${classID}" name="classID" id="classID"/>
		<input type="hidden" th:value="${next}" name="next" id="next"/>
		<form action="/timetables/update" method="get">
			<table border="1" id="timetable">
				<tr id="day">
				</tr>
				<tr id="lessonOne">
				</tr>
				<tr id="lessonTwo">
				</tr>
				<tr id="lessonThree">
				</tr>
				<tr id="lessonFour">
				</tr>
			
			</table>
			<input type="submit" value="保存"/>
		</form>
		<button>返回</button>
		
	</section>
	
<script type="text/javascript" th:inline="none">
	function list(classID,next){
		$.ajax({
			url:"/timetables/list",
			dataType:"json",
			data:{"next":next,"classID":classID},
			success:function(data){
				$("#timetable").html('<tr id="day"><th></th></tr><tr id="lessonOne"><td rowspan="2">上午</td></tr><tr id="lessonTwo"></tr><tr id="lessonThree"><td rowspan="2">下午</td></tr><tr id="lessonFour"></tr>');
				for(var i in data){ 
					$("#day").append('<th><input name="id" type="hidden" value="'+data[i].id+'"/>'+data[i].day+'</th>');
					$("#lessonOne").append('<td><input name="lessonOne" value="'+data[i].lessonOne+'"/></td>');
					$("#lessonTwo").append('<td><input name="lessonTwo" value="'+data[i].lessonTwo+'"/></td>');
					$("#lessonThree").append('<td><input name="lessonThree" value="'+data[i].lessonThree+'"/></td>');
					$("#lessonFour").append('<td><input name="lessonFour" value="'+data[i].lessonFour+'"/></td>');
				} 
			},
			error:function(data){
				//出错时回调该函数 
				alert("timetables-error");
			}
		});
	}
	list($("#classID").val(),$("#next").val())
	
</script>

</body>
</html>